<template>

    <a-row :class="['p-1', `${prefixCls}--box`]" :gutter="10" style="height: 100%;">
        <a-col :xl="4" :lg="8" :md="10" :sm="24" style="flex: 1">
            <a-card :bordered="false" style="height: 100%">

                <productTypeTree2 @selectTree="onTreeSelect">
                </productTypeTree2>

            </a-card>
        </a-col>
        <a-col :xl="20" :lg="16" :md="14" :sm="24" style="flex: 1">
            <a-card :bordered="false" style="height: 100%">
                <productList ref="productListRef" v-model:type="selectKey"></productList>
            </a-card>
        </a-col>
    </a-row>

</template>

<script setup lang="ts">
import { provide, ref,inject } from 'vue';
import { useDesign } from '/@/hooks/web/useDesign';
import productTypeTree2 from './components/productTypeTree2.vue';
import productList from './components/productList.vue';
// 定义与 ref 同名变量
const productListRef = ref(null)
const selectKey = ref("noselected");
function onTreeSelect(data) {
    selectKey.value = data;
    //需要刷新
    productListRef.value.reload();
}
</script>

<style scoped>

</style>